<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>太阳当空照，花儿对我笑</title>
	</head>
	<style type="text/css">
		#box{
			width: 300px;
			height: 200px;
			background: red;
			position: relative;
			overflow: hidden;
			margin:100px auto;
		}
		#mask{
			width:300px;
			height:200px;
			background: black;
			opacity: .3;
			position: absolute;
			left: 0;
			top:0;
			
			
			
		}
	</style>
	<body>
		<input type="text" name="search" id="search" value="" />
		<div id="box">
			<div id="mask">
				
			</div>
		</div>
		<div class="swiper-container">
		    <div class="swiper-wrapper">
		        <div class="swiper-slide" style="background: red;">Slide 1</div>
		        <div class="swiper-slide" style="background: green;">Slide 2</div>
		        <div class="swiper-slide" style="background: blueviolet;">Slide 3</div>
		    </div>
		</div>
		
    
	</body>
</html>
<link rel="stylesheet" type="text/css" href="css/idangerous.swiper.css"/>
<link rel="stylesheet" type="text/css" href="css/jquery-ui.css"/>
<script type="text/javascript" src="require.js" data-main="index.js"></script>
